<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>个人中心_新增收货地址</title>
		<link rel="stylesheet" href="__PUBLIC__/home/css/chushihua.css" />
		<link rel="stylesheet" href="__PUBLIC__/home/css/shouhuodizhi.css" />
		<script src="__PUBLIC__/home/js/jquery-1.8.3.min.js"></script>
		<script src="__PUBLIC__/home/js/shouhuodizhi.js"></script>
		<script src="__PUBLIC__/home/js/jquery.provincesCity.js"></script>
		<script src="__PUBLIC__/home/js/provincesdata.js"></script>
		
	</head>
	<body>
		<include file="Public:header_zc" />

<!--最大  div-->
<div class="content">
<!--个人中心   标题-->

<div class="gouwuchebt">
<div class="logo">
	<a href="{:U('Index/index?key=')}{$appkey}"><img src="{$think_path}{$shop_logo.img}" alt="" /></a>
</div>	
<div class="hyzc"><h1>个人中心</h1></div>

</div>
<!--个人中心   end-->

<!--搜索商品-->
	<form class="form-search" action="{:U('Product/index?key=')}{$appkey}" method="post" id="form2">
	<div class="geren_sousuo">
    			<input type="text" placeholder="商品名称" name="keywords"/>
    			<button  type="submit"  name="sub">确定</button>
    </div>
    </form>
<!--搜索商品  end-->

<!--我的订单-->
<div class="guanzhudianpu">
	<!-- 左边-->
	<include file="Public:left" />
<!--关注的店铺-->
<!-- 右边-->
	<div class="dianpu_you">
		<div class="my"><button class="xianshi">新增收货地址</button>
			<!--<em>已创建<span>4</span>个收货地址，还能创建<span>16</span>个</em>-->
		</div>
		<volist name="address" id="add">
		<div class="demo">
			<div class="one">
           <ul class="type">
           	<li><h1>收货人：</h1><em class="get-value-name">{$add.name}</em><s class="remove_btn"></s></li>
           	<li><h1>地址：</h1><em class="get-value-address">{$add.address_xq}</em></li>
           	<li><h1>电话：</h1><em class="get-value-tell">{$add.tel}</em></li>
           	<li><h1>邮编：</h1><em class="get-value-code">{$add.code}</em></li>
           </ul>
           <p class="ul" style="float: right;">
             	
           	    <a href="{:U('Product/del_address',array('id'=>$add['id'],'key'=>$appkey))}"><em class="tanchu" style="color:#666666 ;font-size: 15px;margin: 0px 20px 0px 0px;height:28px;line-height:28px;cursor: pointer;">删除</em></a>
                <a href="javascript:;"><em class="detail" id="{$add['id']}" style="color:#666666 ;font-size: 15px;margin: 0px 20px 0px 0px;height:28px;line-height:28px;cursor: pointer;">编辑</em></a>
              </p>
             
            </div>
      </div>	
        </volist>
    
        
        
    </div>		
</div>
<!--我的订单   end-->
<script>
function changeclass()
{
  $.post("{:U('Product/city',array('key'=>$appkey))}",{tid:document.getElementById('sheng').value},
        function(data){
        document.getElementById("shi").innerHTML=data;
        }
        );
}
function change()
{
  $.post("{:U('Product/qu',array('key'=>$appkey))}",{tid:document.getElementById('shi').value},
        function(data){
        document.getElementById("qu").innerHTML=data;
        }
     );   
}

function changeclass_1()
{
  $.post("{:U('Product/city',array('key'=>$appkey))}",{tid:document.getElementById('sheng_1').value},
        function(data){
        document.getElementById("shi_1").innerHTML=data;
        }
        );
}
function change_1()
{
  $.post("{:U('Product/qu',array('key'=>$appkey))}",{tid:document.getElementById('shi_1').value},
        function(data){
        document.getElementById("qu_1").innerHTML=data;
        }
     );   
}
 $(function(){
   
   $("#button").on('click', function() {
    if ($("#contact").val()=='') {
      alert("请选择收获地址！");
      return false;
    } else {
      return true;
    }
  });
});
</script> 
<!--弹窗1  新增收货地址弹框-->
	<div class="tanchuang" style="display: none;position: absolute;z-index:6666 ;">
		<div class="bianji clearfix">
			<span style="float: left;margin-left: 10px;">添加收货人信息 </span><span class="quxiao" style="float: right;margin-right: 10px;font-size: 20px;cursor: pointer;">×</span>
		</div>
	<form  action="{:U('Product/address',array('key'=>$appkey))}" method="post" id="for1">
		 <div id="one">
        <h3 class="one"><span>*</span>收货人：</h3>
        <input autocomplete="on" id="Y1" type="text" name="name">
        <h4></h4>
     </div>
     
       <div id="two">
        <h3 class="two"><span>*</span>所在地区：
            <div style="width:400px;margin-top:-20px;margin-left:8px">
            <select onchange="changeclass();" class="inp_1 inp_3" id="sheng" name="sheng"  >
            <option value="">省份</option>
            <volist name="citys" id="ct">
            <option value="{$ct.id}">{$ct.name}</option>
            </volist>
               </select>
               <select onchange="change();"  id="shi" name="shi">
               <option value="">市级</option>
               </select>
               <select id="qu" name="qu">
               <option value="">区级</option>
               </select>
               </div>
</h3>
       
        <h4></h4>
		</div>

       <div id="three">
        <h3 class="three"><span>*</span>详细地址：</h3>
        <input type="text" id="Y3" name="address">
        <h4></h4>
       </div>
       
        <div id="five">
        <h3 class="five"><span>*</span>手机号：</h3>
        <input id="Y5" type="text" name="tel">
        	 <h4></h4>
        	
       
        </div>
       
       <div id="four">
         <h3 class="four">邮政编码：</h3>
        <input  type="text" name="code">
        	<p>用来接收订单提醒邮件，便于你及时了解订单状态。</p>
           <h4></h4>
       </div>
      
        
       <div class="button">
       	<input class="a-1" id="a-1" type="submit" value="保存收货人信息">
       </div>
	</form>	
	</div>
	<div class="mask"></div>
<!--弹窗  end-->	


<!--弹窗2  ***编辑 **** 收货地址弹框-->
	<div class="tanchuang1" style="display: none;position: absolute;z-index:6666 ;">
		<div class="bianji clearfix">
			<span style="float: left;margin-left: 10px;">编辑收货人信息</span><span class="quxiao2" style="float: right;margin-right: 10px;font-size: 20px;cursor: pointer;">×</span>
		</div>
	<form action="{:U('Product/detail',array('key'=>$appkey))}" method="post" id="for2">
		 <div id="one">
        <h3 class="one"><span>*</span>收货人：</h3>
        <input autocomplete="on" id="Y1-1" type="text" name="name">
        <h4></h4>
     </div>
     
       <div id="two1">
          <h3 class="two"><span>*</span>所在地区：
            <div style="width:400px;margin-top:-20px;margin-left:8px">
            <select onchange="changeclass_1();" class="inp_1 inp_3" id="sheng_1" name="sheng"  >
            <option value="">省份</option>
            <volist name="citys" id="ct" class="ct">
            <option value="{$ct.id}">{$ct.name}</option>
            </volist>
               </select>
               <select onchange="change_1();"  id="shi_1" name="shi" class="shi">
               <option value="">市级</option>
               </select>
               <select id="qu_1" name="qu"  class="qu">
               <option value="">区级</option>
               </select>
               </div>
</h3>
        <h4></h4>
		</div>
		<script>
    //调用插件
    $(function(){
       // $("#two1").ProvinceCity();
        //$("#two").ProvinceCity();
    });
  </script>
        <div id="three">
        <h3 class="three"><span>*</span>详细地址：</h3>
        <input type="text" id="Y3-1" name="address">
        <h4></h4>
       </div>
       
        <div id="five">
        <h3 class="five"><span>*</span>手机号：</h3>
        <input id="Y5-1" type="text" name="tel">
           <h4></h4>
          
       
        </div>
       
       <div id="four">
         <h3 class="four">邮政编码：</h3>
        <input id="Y6" type="text" name="code">
          <p>用来接收订单提醒邮件，便于你及时了解订单状态。</p>
           <h4></h4>
       </div>
      
        <input id="Y7" type="hidden" name="id">
       <div class="button">
       	<input class="a-1" id="a-1" type="submit" value="保存收货人信息">
       </div>
	</form>	
	</div>
	<div class="mask1"></div>
<!--弹窗  end-->	


<!--结尾-->
 <include file="Public:footer" />
 <script type="text/javascript">
     $(function(){
     //编辑收货地址
      /*$(".detail").click(function(){
         var id = $(this).attr("id");
         $(".tanchuang1").show();
         /*$.post("{:U('User/address?key=')}{$appkey}", {
                  "id" : id
              }, function(data) {
                  if (data == 1) {
                       alert(1);
                  }else if(data == 0){
                   
                  }
             })
       });*/
      $(".quxiao2").click(function(){  
                 $(".tanchuang1").hide();
      });
      
      $(".detail").click(function(){
        var id = $(this).attr("id");
      	var $parent = $(this).parent().parent().prev();
      	var _htmlName = $parent.find('.get-value-name').html();
      	var _htmlAddress = $parent.find('.get-value-address').html();
      	var _htmlTel = $parent.find('.get-value-tell').html();
      	var _htmlCode = $parent.find('.get-value-code').html();
        $(".mask1").show();
        $(".tanchuang1").show(); 
        $('#Y1-1').val(_htmlName);
        $('#Y3-1').val(_htmlAddress);
        $('#Y5-1').val(_htmlTel);
        $('#Y6').val(_htmlCode);
        $('#Y7').val(id);
    })
      autoCenter($(".tanchuang1"))
      $(".quxiao2").click(function(){
        $(".mask1").hide();
          $(".tanchuang1").hide(); 
           $(".mask1").hide();     
      })
      function autoCenter(p) {
            var ele = document.documentElement || document.body;
            var x = (ele.clientWidth - p.width()) / 2;
            var y = (ele.clientHeight - p.height()) / 2;
            p.css({
                left: x,
                top: y
            })
    }
      $(window).resize(function () {
                autoCenter($(".tanchuang1"));
            }) 

         
     })
 </script>
	</body>
</html>


